<template>
	<!-- 红柳版本 -->
	<view>
		<!-- 头部搜索框 -->
		<search :placeholder="$t('public.cutCode')" />
		<!-- 已选择工序/未报工工序 -->
		<view class="title" v-if="title">
			{{title}}
		</view>
		<zy-table ref="zyTable" :headList="setList" :dataList="setData" :checkbox="checkbox"
			@handleSelectionChange="handleSelectionChange" :loading="setLoading" border></zy-table>
		<!-- 底部按钮 -->
		<bottomBtn fixed type="danger" :text="$t('public.reset')" @btn="resetBtn" :disabled="disabled">
		</bottomBtn>
		<!-- 无效二维码提示 -->
		<zy-popup ref="codePopup" title="无效二维码" type="dialog" @confirm="$refs.codePopup.close(),resetBtn()">
			{{$t("homepage.ProductionMonitor.invalidTip")}}
		</zy-popup>
		<!-- 报工返回数据提示 -->
		<zy-popup ref="popup" :title="$t('homepage.ProductionMonitor.reportData')" type="dialog" @confirm="submit">
			<view style="text-align: center;">
				{{message}}
			</view>
		</zy-popup>
		<!-- 未报工工序数据 -->
		<zy-popup ref="unReportPopup" :title="$t("homepage.ProductionMonitor.unReportMessage")" type="dialog" @confirm="$refs.unReportPopup.close(),resetBtn()">
			<view style="text-align: center;">
				{{unReportMessage}}
			</view>
		</zy-popup>
	</view>
</template>

<script>
	import {
		mobileTaskReport,
		queryRestProduction
	} from "@/api/homepage.js"
	// 小米POS机打印
	const print = uni.requireNativePlugin('Sunmi-Print-Inner');
	var isConnect = false;
	// 语音播报
	import audio from '../../../common/audio.js'
	export default {
		data() {
			return {
				title: this.$t('homepage.ProductionMonitor.choosedProcedure'),
				//表格表头
				setList: [{
						name: this.$t('public.procedureCode'),
						key: 'procedureCode',
					},
					{
						name: this.$t('public.procedureName'),
						key: 'procedureName',
					}
				],
				setData: [], //表格数据
				setLoading: true,
				checkbox: true, //表格多选框
				procedureId: '',
				selectedId: '',
				disabled: true,
				message: "", //报工返回数据
				barcode: "",
				unReportMessage: "", //未报工工序提示
			}
		},
		onLoad() {
			//PDA扫描
			var _this = this
			uni.$on('scancodedate', function(data) {
				_this.searchList(data.code)
			})
		},
		onUnload() {
			// 移除监听事件      
			uni.$off('scancodedate')
		},
		mounted() {
			this.getList()
		},
		methods: {
			//获取本地保存的已选择工序表格数据
			getList() {
				this.setData = []
				let arr = uni.getStorageSync("procedureData")
				arr.forEach((item, index) => {
					if (item.switch) {
						this.setData.push(item)
					}
				})
			},
			//点击多选框
			handleSelectionChange(e) {
				this.selectedId = ""
				e.value.forEach((item) => {
					this.selectedId += item.procedureId + ','
				})
			},
			//搜索内容查询
			searchList(e) {
				// 截取获取字段值
				let name = "barcode"
				var reg = new RegExp("(^|)" + name + "=([^&]*)(&|$)");
				this.disabled = false //底部按钮
				if (e.substr(1).match(reg) !== null) {
					this.barcode = e.substr(1).match(reg)[2];
					// 工序组Id
					this.procedureId = ''
					if (this.selectedId == '') {
						this.setData.forEach((item) => {
							this.procedureId += item.procedureId + ','
						})
					} else {
						this.procedureId = this.selectedId
					}
					// 报工事件
					mobileTaskReport({
						barcode: this.barcode,
						procedureId: this.procedureId
					}).then((res) => {
						if (res.code == 0) {
							audio.innerAudio.getInnerAudio('../../../static/success.mp3')
							this.setLoading = true
							setTimeout(() => {
								this.start(this.barcode)
							setTimeout(() => {
								this.submit()
							}, 500)
							}, 500)
						} else {
							audio.innerAudio.getInnerAudio('../../../static/fail.mp3')
						this.message = res.message
						this.$refs.popup.open()
						}
					}).catch((res) => {
						audio.innerAudio.getInnerAudio('../../../static/fail.mp3')
						this.message = res.message
						this.$refs.popup.open()
					});
				} else {
					audio.innerAudio.getInnerAudio('../../../static/invalid.mp3')
					this.$refs.codePopup.open()
				}
			},
			// 查询未报工事件
			submit() {
				this.$refs.popup.close()
				queryRestProduction({
					productionTaskNo: this.barcode,
					procedureId: this.procedureId
				}).then((res) => {
					console.log(res)
					if (res.code == 0) {
						this.setData = []
						this.setLoading = false
						this.title = ""
						this.checkbox = false
						//表格表头
						this.setList = [{
								name: this.$t('public.status'),
								key: 'productionStatus',
							}, {
								name: this.$t(
									'public.productionNo'),
								key: 'productionNo',
								width: "150"
							}, {
								name: this.$t(
									'homepage.ProductionMonitor.planCode'
								),
								key: 'planCode',
							}, {
								name: this.$t('public.name'),
								key: 'name',
							}, {
								name: this.$t(
									'public.styleNo'),
								key: 'styleNo',
							}, {
								name: this.$t(
									'public.styleName'),
								key: 'styleName',
								width: "330"
							}],
							this.setData = res.data.map(m => {
								return Object.assign(m, {
									color: ""
								})
							})
						this.setData.forEach((item, index) => {
							if (item.productionStatus == "已完成") {
								this.setData[index].color = "#2B9939"
							}
						})
					} else {
						audio.innerAudio.getInnerAudio('../../../static/returnFail.mp3')
						this.$refs.unReportPopup.open()
						this.unReportMessage = res.message
					}
				}).catch((res) => {
					audio.innerAudio.getInnerAudio('../../../static/network.mp3')
					this.$refs.unReportPopup.open()
					this.unReportMessage = res.message
				});
			},
			// 重置事件
			resetBtn() {
				uni.redirectTo({
					url: "/pages/HomePage/ProductionMonitor/index"
				})
			},
			// 准备打印事件
			start(e) {
				let that = this
				print.connect(res => {
					isConnect = res.connect == "hello"
					if (isConnect) {
						that.printBtn(e); //打印
					} else {
						return
					}
				})
			},
			// 打印事件
			printBtn(e) {
				//打印小票
				print.printQrCode({
					text: e,
					size: 6,
					errorlevel: 0,
					align: 1
				})
				//空白行分割之前打印内容（类似走空白）
				print.printDividingline({
					style: "4",
					height: "10"
				})
				print.printText({
					text: "单号：" + e,
					align: 1,
					size: 26,
					bold: true,
				})
				print.labelOutput()
			},
		}
	}
</script>

<style lang="scss" scoped>
	.title {
		border-left: 3px solid #409efe;
		padding: 14px 10px 10px 10px;
		background-color: #ffffff;
	}
</style>